<template>
  <div id="app" :class="[isShow?'book-content':'',accId == '3'?'custom-zxx':'custom-dz']">
    <myLogin v-show="loginShow"></myLogin>
    <backTop></backTop>
    <router-view />
  </div>
</template>

<script>
import myLogin from "@/components/myLogin";
import backTop from "@/components/backTop";
import "../static/theme/dz/index.css";
import "../static/theme/zxx/index.css";
export default {
  name: "App",
  data() {
    return {
      childValue: false
    };
  },
  created() {
    //在页面加载时读取sessionStorage里的状态信息
    if (sessionStorage.getItem("store")) {
      this.$store.replaceState(
        Object.assign(
          {},
          this.$store.state,
          JSON.parse(sessionStorage.getItem("store"))
        )
      );
    }

    //在页面刷新时将vuex里的信息保存到sessionStorage里
    window.addEventListener("beforeunload", () => {
      sessionStorage.setItem("store", JSON.stringify(this.$store.state));
    });
    console.log(this.accId);
    if (this.accId == "3") {
      document.title = "中小学";
    } else {
      document.title = "享读书党政";
    }
  },
  computed: {
    accId() {
      return this.$store.state.user.accId || "3";
    },
    loginShow() {
      return this.$store.state.loginShow;
    },
    isShow() {
      // $route.path ='/periodical/content'
      // /book/content
      const path = this.$route.path;
      switch (path) {
        case "/book/content":
          return true;
          break;
        case "/periodical/content":
          return true;
          break;
        case "/newspaper/content":
          return true;
          break;
        default:
          return false;
          break;
      }
    }
  },
  components: {
    myLogin,
    backTop
  },

  methods: {}
};
</script>

<style>
.book-content {
  background: #e5e4d8 !important;
}
body,
html {
  margin: 0px;
  padding: 0px;
}
a {
  text-decoration: none;
  color: #000;
}
hr {
  height: 1px;
  background: #c1c1c1;
  margin: 20px 0;
  border: none;
}
p{
  margin: 0px;
  padding: 0px;
}
ul {
  list-style-type: none;
  margin: 0;
}
#app {
  font-family: "MicrosoftYaHei", "Avenir", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.custom-zxx {
  background: url("/static/images/base/index_bg.png");
}
.custom-dz {
  background: url("/static/images_dz/base/index_bg.png");
}
.text-center {
  text-align: center;
  display: block;
}
.pagination {
  text-align: right;
  
}
.el-pager li.active{
  border-radius: 5px;
}
.web-container {
  width: 1200px;
  height: 100%;
  max-width: 1200px;
  min-height: 600px;
  overflow: hidden;
  margin: 0 auto;
}
.container-flex {
  display: flex;
  justify-content: space-between;
}
</style>
